<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<button onclick="fetchData()">点击</button>
<ul id="result"></ul>

<script>
    function setChildrenLi(item,elementById,ulChildrenElement){
        let liElement = document.createElement("li");
        let aElement = document.createElement("a");
        aElement.href = item.permissionUrl;
        aElement.textContent = item.permissionName;
        liElement.appendChild(aElement);

        let childrenList = item.childrenList;
        if (null!=childrenList){
            console.log("捡来了")
            let ulChildrenElement = document.createElement("ul");
            childrenList.forEach(item=> setChildrenLi(item,elementById,ulChildrenElement))
            liElement.appendChild(ulChildrenElement);
        }
        if (null!=ulChildrenElement){
            ulChildrenElement.appendChild(liElement)
        }
        if (null == ulChildrenElement){
            elementById.appendChild(liElement)
        }

    }
    function fetchData(){
        fetch('http://127.0.0.1:8101/sys/sysPermission/getAllMapList')
            .then(function (response) {
                return response.json();
            })
            .then((date)=>{
                let elementById = document.getElementById('result');
                date.forEach((item)=> setChildrenLi(item,elementById,null));
            })
            .catch(function (error) {
                console.log(error);
            });
    }
</script>
</body>
</html>